import { PageHeaderWrapper } from '@ant-design/pro-layout';
import type { ProColumns } from '@ant-design/pro-components';
import { ProTable } from '@ant-design/pro-components';
import { queryInvoiceTitleList } from '../service';
import type { InvoiceTitleTableItem } from '../types.d';
import { InvoiceInfoType } from '../types.d';

const InvoiceTitleList = () => {
  const column: ProColumns<InvoiceTitleTableItem>[] = [
    {
      title: 'id',
      hideInTable: true,
      hideInForm: true,
      hideInSearch: true,
      dataIndex: '_id',
    },
    {
      title: '抬头类型',
      dataIndex: 'type',
      hideInForm: true,
      valueEnum: {
        [InvoiceInfoType.COMPANY]: '企业单位',
        [InvoiceInfoType.PERSON]: '个人/非企业单位',
      },
    },
    {
      title: '抬头名称',
      dataIndex: 'title',
      hideInForm: true,
      align: 'center',
    },
    {
      title: '税号',
      dataIndex: 'taxId',
      hideInForm: true,
      align: 'center',
    },
    {
      title: '用户手机号',
      dataIndex: 'userPhone',
      hideInForm: true,
      align: 'center',
    },
    {
      title: '注册地址',
      dataIndex: 'address',
      hideInForm: true,
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '注册电话',
      dataIndex: 'telephone',
      hideInForm: true,
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '开户行',
      dataIndex: 'bank',
      hideInForm: true,
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '开户行账号',
      dataIndex: 'bankAccount',
      hideInForm: true,
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',
      align: 'center',
      hideInForm: true,
      hideInSearch: true,
      valueType: 'dateTime',
    },
  ];
  return (
    <PageHeaderWrapper
      header={{
        title: '',
        subTitle: '发票抬头列表',
        breadcrumb: {
          routes: [
            {
              path: '/',
              breadcrumbName: '首页',
            },
            {
              path: '/invoice',
              breadcrumbName: '发票管理',
            },
            {
              path: '/invoice/titles',
              breadcrumbName: '抬头列表',
            },
          ],
        },
      }}
    >
      <ProTable<InvoiceTitleTableItem>
        columns={column}
        rowKey="_id"
        style={{ whiteSpace: 'nowrap' }}
        scroll={{ x: true }}
        search={{
          labelWidth: 'auto',
        }}
        columnEmptyText="暂无数据"
        dateFormatter="string"
        pagination={{
          showSizeChanger: true,
          showQuickJumper: true,
          defaultPageSize: 10,
          size: 'default',
        }}
        debounceTime={300}
        request={async (param, sort) => {
          const res = await queryInvoiceTitleList(param, sort);
          return res;
        }}
      />
    </PageHeaderWrapper>
  );
};

export default InvoiceTitleList;
